<script setup>
import { getAiImgRecordConsumeList } from '@/api/painting';
import { ref } from 'vue'
import { onLoad } from '@dcloudio/uni-app';

const flag = ref(true)
const page = ref(0)
const list = ref([])



function formTitleFn(e) {
  if (e.ptype === 0) {
    return e.typeName
  } else {
    if (e.remark) {
      return e.remark
    } else {
      return e.typeName
    }
  }
}

function formValueFn(e) {
  if (e.ptype === 0) {
    return `-${e.consumeImgNum.toFixed(1)}`
  } else {
    if (e.consumeImgNum > 0) {
      return `+${e.consumeImgNum.toFixed(1)}`
    } else {
      return `${e.consumeImgNum.toFixed(1)}`
    }
  }
}

const getAiImgRecordConsumeListFn = async () => {
  if (flag.value) {
    const res = await getAiImgRecordConsumeList({ type: 0, page: page.value })
    if (res.data.length >= 10) {
      ++page.value
    } else {
      flag.value = false
    }
    list.value.push(...res.data)
  }
}

const scrolltolower = () => {
  getAiImgRecordConsumeListFn()
}


onLoad(() => {
  getAiImgRecordConsumeListFn()
})
</script>

<template>
  <scroll-view scroll-y class="scroll-y" @scrolltolower="scrolltolower">
    <NavBar>算力明细</NavBar>
    <van-cell v-for="item of list" :title="formTitleFn(item)" :label="item.createTime" :value="formValueFn(item)"
      :border="false"></van-cell>
  </scroll-view>
  <van-toast id="van-toast"></van-toast>
</template>

<style lang="less" scoped>
.scroll-y {
  height: 100vh;
  padding-bottom: 10rpx;

  /deep/.van-cell {
    width: 690rpx;
    height: 136rpx;
    background: var(--a-main-box-bg-color);
    border-radius: 16rpx;
    margin: 20rpx auto;
    position: relative;

    .van-cell__title {
      font-size: 32rpx;
      color: var(--a-one-text-color);
    }

    .van-cell__label {
      color: var(--a-two-text-color);
    }

    .van-cell__value {
      position: absolute;
      top: 45rpx;
      right: 40rpx;
      color: var(--a-one-text-color);
      font-weight: bold;

    }
  }
}
</style>